document.addEventListener('DOMContentLoaded', function() {
  const extractButton = document.getElementById('extractText');
  const imageInput = document.getElementById('imageInput');
  const resultDiv = document.getElementById('result');

  extractButton.addEventListener('click', function() {
    const file = imageInput.files[0];
    if (file) {
      Tesseract.recognize(file)
        .then(function(result) {
          resultDiv.innerText = result.data.text;
        })
        .catch(function(error) {
          console.error(error);
          resultDiv.innerText = 'Error occurred during OCR';
        });
    } else {
      resultDiv.innerText = 'Please select an image first.';
    }
  });
});